<template>
	<view class="create-order">
		<u-navbar
			title="确认订单"
			:autoBack="true"
			placeholder
		>
		</u-navbar>
		
		<view class="content">
			<view class="order-address wrap" @click="chooseAddress">
				<view class="order-address__map"><u-icon name="map-fill" color="#f56c6c" size="20"></u-icon></view>
				<view class="order-address__info">
					<view class="order-address__msg">{{ addressItem.address }}</view>
					<view class="order-address__name">{{ addressItem.name }} {{ addressItem.phone }}</view>
				</view>
				<view class="order-address__more"><u-icon name="arrow-right" color="#909399"></u-icon></view>
				<image src="../../static/address-line.png" class="address-line"></image>
			</view>
			
			<view class="order-detail wrap">
				<view class="order-detail-goods" v-for="(item,index) in goodsList" :key="index">
					<image :src="minioUrl + item.image"></image>
					<view class="order-detail-goods__info">
						<view class="goods__info__name"><u-text :text="item.name" lines="1"></u-text></view>
						<view class="goods__info__specs">{{ item.specs }}</view>
						<view class="goods__info__price">￥{{item.price}} <text>× {{item.count}}</text></view>
					</view>
				</view>
				<view class="order-detail-data">
					<view class="order-detail-data__wrap">
						<view class="detail-data__title">商品金额</view>
						<view class="detail-data__value">￥ {{ originTotal }}</view>
					</view>
					<view class="order-detail-data__wrap">
						<view class="detail-data__title"><text>抵</text>抵扣积分</view>
						<view class="detail-data__value"> {{ useIntegral }}</view>
					</view>
					<view class="order-detail-data__wrap">
						<view class="detail-data__title detail-data__title__coupon"><text>赠</text>赠送积分</view>
						<view class="detail-data__value detail-data__value__coupon">
							{{ getIntegral }}
						</view>
					</view>
					<view class="order-detail-data__wrap">
						<view class="detail-data__title">配送费</view>
						<view class="detail-data__value">￥ {{ freight }}</view>
					</view>
				</view>
				<view class="order-detail-total">
					<view>小计：<text>￥ {{ actualTotal }}</text></view>
				</view>
			</view>
			
			<view class="order-notes wrap">
				<view class="order-notes__header">订单备注：</view>
				<view class="order-notes__content">
					<u--textarea v-model="notes" placeholder="选填,合理需求我们会尽量满足 .." border="none" height="60"></u--textarea>
				</view>
			</view>
		</view>
		
		
		<view class="order-submit">
			<view class="order-submit__total">实付款：<text>￥ {{ actualTotal }}</text></view>
			<view class="order-submit__button">
				<u-button text="提交订单" shape="circle" color="#f56c6c" @click="createOrderClick"></u-button>
				</view>
		</view>
		
		<u-toast ref="uToastRef"></u-toast>
	</view>
</template>

<script lang="ts" setup>
	import { ref,getCurrentInstance,onMounted,computed } from 'vue'
	import {onLoad} from "@dcloudio/uni-app";	
	import type { IAddress } from "@/types/address"
	import type { ICreateOrder } from '@/types/order';
	
	const { proxy }: any = getCurrentInstance()
	const notes = ref('')
	const minioUrl = proxy.$minioUrl
	const addressItem = ref<IAddress>()
	const goodsList = ref<ICreateOrder[]>([])
	const integral = ref(0)	
	const useIntegral = ref(0)
	const getIntegral = ref(0)
	const freight = ref(0)
	const originTotal = ref(0)
	const actualTotal = ref(0)
	const aid = ref('')
	const uToastRef = ref()
	
	const chooseAddress = () => {
		uni.redirectTo({
			url: '/user/address_list/address_list?historyPage=createOrder'
		})
	}
	
	const createOrderClick = () => {
		let userId = uni.getStorageSync("info").id
		let data = {
			userId: userId,
			goodsInfo: JSON.stringify(uni.getStorageSync("createOrder")),
			useIntegral: useIntegral.value,
			getIntegral: getIntegral.value,
			originTotal: originTotal.value,
			actualTotal: actualTotal.value,
			address: JSON.stringify(addressItem.value),
			notes: notes.value
		}
		proxy.ajax(proxy.api.createOrder, "POST", data, function(resp: any){
			let order = resp.data.order
			if(order.orderId && order.orderNum !== ""){
				uToastRef.value.show({
					type: 'success',
					message: "提交成功",
					complete: ()=>{
						uni.redirectTo({
							url: "/order/order_payment/order_payment?orderId=" + order.orderId + "&orderNum=" + order.orderNum
						})
					}
				})
			}else{
				uToastRef.value.show({
					type: 'error',
					message: "提交失败，请重新提交",
				})
			}
		})
	}
	
	onMounted(()=>{
		let createOrderInfo = uni.getStorageSync("createOrder")
		let userId = uni.getStorageSync("info").id
		let data = {
			userId: userId,
			aid: aid.value,
		}
		proxy.ajax(proxy.api.getCreateOrderInfo, "POST", data, function(resp: any){
			addressItem.value = resp.data.info.entity
			integral.value = resp.data.info.integral
			let sum = 0
			for(let i=0;i<goodsList.value.length;i++){
				let item = goodsList.value[i]
				sum += item.count*item.price
			}
			originTotal.value = sum
			let ui = Math.floor(sum / 10)
			useIntegral.value = ui > integral.value ? integral.value : ui
			getIntegral.value = Math.floor((originTotal.value - useIntegral.value) / 10)
			actualTotal.value = originTotal.value-useIntegral.value+freight.value
		})
		goodsList.value = createOrderInfo
	})
	
	onLoad((options)=>{
		aid.value = JSON.stringify(options) === '{}' ? '' : options?.aid
	})
</script>

<style lang="scss">
	@import "style.scss"
</style>